import { Input } from 'antd';
import type { SearchProps } from 'antd/es/input/Search';
import React from 'react';
import styles from './Search.less';

interface SearchParamProps {
  placeholder: string;
  onSearchValue: (value: string) => void;
}

const { Search } = Input;

const App: React.FC<SearchParamProps> = ({ placeholder, onSearchValue }) => {
  const onSearch: SearchProps['onSearch'] = (value) => {
    onSearchValue(value);
  };
  return (
    <div className={styles.container}>
      <Search
        placeholder={placeholder}
        allowClear
        className={styles.search}
        onSearch={onSearch}
        size="large"
      />
    </div>
  );
};

export default App;
